<template>
	<view class="content">
		<Header>
			社情民意
		</Header>
		<liuyuno-tabs :tabData="tabs" :activeIndex="defaultIndex" @tabClick='tabClick' />
		<view style="height: calc(100vh - 86px - var(--status-bar-height));" >
			<MyOpinion v-if="defaultIndex == 0"></MyOpinion>
			<OpinionForm :id="opinionId" v-if="defaultIndex == 1"></OpinionForm>
			<OpinionDraft v-if="defaultIndex == 2"></OpinionDraft>
			<OpenOpinion v-if="defaultIndex == 3"></OpenOpinion>
		</view>
	</view>
</template>

<script>
	import Header from '../../components/header.vue'
	import Footer from '../../components/footer.vue'
	import liuyunoTabs from "@/components/liuyuno-tabs/liuyuno-tabs.vue";
	import MyOpinion from './myOpinion.vue'
	import OpinionForm from './opinionForm.vue'
	import OpinionDraft from './opinionDraft.vue'
	import OpenOpinion from './openOpinion.vue'
	export default {
		components: {
			Header,
			Footer,
			liuyunoTabs,
			MyOpinion,
			OpinionForm,
			OpinionDraft,
			OpenOpinion,
		},
		data() {
			return {
				tabs: ['我的', '提交', '草稿', '公开'],
				defaultIndex: 0,
				opinionId: '',
			}
		},
		onLoad() {

		},
		mounted() {
			uni.$on('showContent', (data) => {
				
				if(data.page == 'form'){
					this.opinionId = ''
					if(data.type == 1){
						this.defaultIndex = 0
					}else{
						this.defaultIndex = 2
					}
				}else if(data.page == 'draft'){
					this.defaultIndex = 1
					this.opinionId = data.id
				}
			})
		},
		methods: {
			tabClick(index) {
				if(index != 1) this.opinionId = ''
				this.defaultIndex = index
			}
		}
	}
</script>

<style scoped>
	::v-deep ._tab-box::after {
		position: absolute;
		bottom: 0;
		right: 0;
		left: 0;
		height: 1px;
		content: "";
		transform: scaleY(0.5);
		background-color: #e5e5e5;
	}

	::v-deep ._item {
		font-weight: normal !important;
	}

	::v-deep ._item._active {
		font-weight: bold !important;
	}
</style>